/*
 * @Author: 六弦(melodyWxy)
 * @Date: 2022-02-07 10:11:44
 * @LastEditors: 六弦(melodyWxy)
 * @LastEditTime: 2022-02-07 17:42:42
 * @FilePath: /rndemo01/src/pages/Home/index.js
 * @Description: update here
 */

import React, {Component} from 'react';
import {Image, View, TextInput} from 'react-native';

import Swiper from './../../components/Swiper';

import styles from './style';

const MOCK_BANNER_LIST = [
  'https://img0.baidu.com/it/u=1963157296,2726063296&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
  'https://img2.baidu.com/it/u=1615680299,2764947626&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
  'https://img0.baidu.com/it/u=1350644485,2821864150&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
];

class Home extends Component {
  state = {
    bannerList: [],
  };
  componentDidMount() {
    Promise.resolve(MOCK_BANNER_LIST).then(res => {
      this.setState({
        bannerList: res,
      });
    });
  }
  render() {
    return (
      <View style={styles.wrap}>
        <View style={styles.header}>
          <View style={styles.iconBox} />
          <View style={styles.searchBox}>
            <Image
              style={styles.searchIcon}
              source={{
                uri: 'https://img0.baidu.com/it/u=1243286159,415302547&fm=253&fmt=auto&app=138&f=JPEG?w=260&h=260',
              }}
            />
            <View style={styles.searchInputWrap}>
              <TextInput
                style={styles.searchInput}
                editable
                placeholder="请输入"
              />
            </View>
            <View style={styles.searchBoxRight} />
          </View>
          <View style={styles.iconBox} />
        </View>
        <View style={styles.banner}>
          <Swiper bannerList={this.state.bannerList} autoPlay />
        </View>
      </View>
    );
  }
}

export default Home;
